<!-- 变更记录修改table -->
<template>
  <div class=''>
    <Table ref="TableHeight" :max-height="400" :columns="columns" :data="tableList" border>
      <!-- 审核人类型 -->
      <template slot-scope="{ row }" slot="inGroupDate">
        <DatePicker v-if="row.flag?row.flag:false" type="date" v-model="row.inGroupDate"
          :options="options" :transfer="true" @on-change="data=>{handleChange(data,row)}"
          :clearable=false format="yyyy-MM-dd">
        </DatePicker>
        <span v-show="!row.flag">{{row.inGroupDate}}</span>
      </template>
      <template slot-scope="{ row }" slot="operate">
        <div v-show="!row.flag" class="operate_btn">
          <Button type='text' :disabled='btnFlag' @click="editFun(row)">编辑</Button>
          <Button type='text' :disabled='btnFlag' @click="deleteRow(row)">删除</Button>
        </div>
        <div v-show="row.flag" class="operate_btn">
          <Button type='text' @click="confirm(row)">确定</Button>
          <Button type='text' @click="cancel(row)">取消</Button>
        </div>
      </template>
    </Table>
  </div>
</template>

<script>
  import editColumns from './opt/editLogColumn'
  import moment from 'moment'
  import teamsApi from '@/biz/buildingManagement/teams'
  import dt from '@dt/dt';
  export default {
    data() {
      return {
        tableList: [],
        columns: editColumns.Columns,
        options: {},
        btnFlag: false,
        startDate: '',
        endDate: '',
        currentChangeDate: '', //记录发生改变的数据
        oldDate: {},
        checkFlag: false
      };
    },
    methods: {
      onChangetable(row) {
        let list = this.tableList
        list.splice(row._index, 1, row)
      },
      editFun(data) {
        let that = this
        this.currentChangeDate = '' //清空上一次改变时存储的数据
        this.oldDate = data
        this.btnFlag = true
        data.flag = true
        if (data._index == 0) {
          //首条记录不得早于进场日期
          this.startDate = ''
          if (this.tableList.length == 1) {
            this.endDate = moment(Date.now() + 86400000).format('YYYY-MM-DD')
          } else {
            this.endDate = this.tableList[(data._index + 1)].inGroupDate
          }
        } else
        if (data._index == this.tableList.length - 1) {
          //最后一条记录不得晚于今日
          this.startDate = this.tableList[(data._index - 1)].inGroupDate
          this.endDate = moment(Date.now() + 86400000).format('YYYY-MM-DD')
        } else {
          //可选生效日期必须大于等于上一条数据的生效日期且小于下一条数据的生效日期
          this.startDate = this.tableList[(data._index - 1)].inGroupDate
          this.endDate = this.tableList[(data._index + 1)].inGroupDate
        }
        this.options = {
          disabledDate(date) {
            return date && (date.valueOf() < Date.parse(that.startDate) - 86400000 || date
              .valueOf() > Date.parse(that.endDate) - 86400000)
          }
        }
        this.onChangetable(data)
      },
      //发生改变
      handleChange(date) {
        this.currentChangeDate = date
      },
      cancel(data) {
        this.btnFlag = false
        this.oldDate.flag = false
        this.onChangetable(this.oldDate)
      },
      confirm(data) {
        data.inGroupDate = moment(data.inGroupDate).format('YYYY-MM-DD')
        this.onChangetable(data)
        console.log(data)
        let params = {
          workNo: data.workNo,
          groupId: data.groupId,
          groupLeader: data.groupLeader,
          sureDate: data.inGroupDate,
          logId: data.logId,
          teamId: this.$dt.session.get("teamsId"),
          displayNum: data.displayNum
        }
        teamsApi.changeRecordUpdate(params).then((res) => {
          data.flag = false
          this.btnFlag = false
        })
      },
      deleteRow(data) {
        console.log(data, data._index + 1, this.tableList.length, 'deleteRow')
        this.$Modal.confirm({
          title: '变更记录',
          content: `是否确认删除此条变更记录？`,
          okText: '确定',
          cancelText: '取消',
          onOk: () => {
            let isItTheLast = false
            if (this.tableList.length > 1) {
              isItTheLast = data._index + 1 == this.tableList.length ? true : false
            }
            if (this.tableList.length == 1) {
              let params = {
                workNo: data.workNo,
                groupId: this.checkFlag ? '' : data.groupId,
                teamId: this.$dt.session.get("teamsId")
              }
              teamsApi.delLastOneLog(params).then((res) => {
                let listIndex = this.tableList.indexOf(
                  this.tableList.filter((d) => d.logId == data.logId)[0]
                )
                this.tableList.splice(listIndex, 1)
                this.$emit('changeTableSuccess')
              })
            } else {
              let params = {
                logId: data.logId,
                isItTheLast: isItTheLast,
                exLogId: isItTheLast ? this.tableList[data._index - 1].logId : '',
                teamId: this.$dt.session.get("teamsId")
              }
              teamsApi.changeRecordDelete(params).then((res) => {
                let listIndex = this.tableList.indexOf(
                  this.tableList.filter((d) => d.logId == data.logId)[0]
                )
                this.tableList.splice(listIndex, 1)
                this.$emit('changeTableSuccess')
              })
            }

          }
        })

      },
    },
    mounted() {
      editColumns.sendThis(this) //发送this 到 js 文件里
    },

  }
</script>
<style lang='scss' scoped>

</style>